import React, { Component } from "react";
import "./MyProtocolList.scss";
import {
	getAppPlatformsDatas,
	getDeviceInfoDatas,
	getPayDatas
} from "../../../Redux/Action/nativeDatas/nativeDatas";
import { connect } from "react-redux";
import { Toast } from "antd-mobile";
import { setUserType } from "../../../Redux/Action/credit/AuthenticationA";
import { signedContract } from "../../../Redux/Action/signedContract/signedContract";
import NoData from "../../../component/noData/noData";
import yhTools from "../../../tools/yh";
import XFButton from "../../../xfCompontent/xfButton/xfButton";
import SendMSGCode from "../../../component/sendMSGCode/sendMSGCode";
import { InterfaceG, agreements_url } from "../../../config/Config";
import MainLayout from "../../../component/mainLayout/mainLayout";
import themeUtil from "../../../tools/theme";
class MyProtocolList extends Component {
	constructor(props) {
		super(props);
		this.state = {
			btnText: "同意并签署",
			isSignedFWZX: "", //永辉金融客户服务协议及授权书
			isSignedXHED: "", //个人循环额度贷款合同
			arrarAll: [
				["1.0.0", "xhht", "个人循环授信借款合同"],
				["1.0.0", "zfxy", "连连银通银行卡支付服务协议"]
			], //存放所有的后台返回的数据
			isLoaded: false, //是否加载过数据
			showMsgBox: false,
			flag: false
		};
		this.isFromPayTool =
			this.props.location.query && this.props.location.query.name == "index";
	}

	componentDidMount() {
		if (this.props.location.query) {
			this.setState({
				flag: true
			});
		}
	}

	//同意签约
	btnFn() {
		//判断是生活app
		if (
			themeUtil.getTheme() == "yhLife" &&
			this.props.getAppPlatformsDatas.lnid == "602"
		) {
			//生活app
			this.shxhfSignKlnContract();
		} else {
			//买菜app
			this.islianlianSign(false);
		}
	}

	//提交回调
	submitCode(code) {
		if (
			themeUtil.getTheme() == "yhLife" &&
			this.props.getAppPlatformsDatas.lnid == "602"
		) {
			//生活app
			this.shxhfVSignKlnContract(code);
		} else {
			//买菜app
			this.vSignXhContract(code);
		}
	}

	//生活签署合同
	shxhfSignKlnContract() {
		let objs = {
			url: InterfaceG.shxhfSignKlnContract,
			params: {
				source: this.isFromPayTool ? "0" : "-1" // 收银台传0,其余任意
			},
			_alertShow: false
		};
		let _that = this;
		Toast.loading("加载中...", 100);
		yhTools.request(objs).then(res => {
			if (res.code === "0") {
				Toast.hide();
				_that.sendCode.countdown();
				const pageNo = res.data.pageNo;
				_that.orderNo = res.data.orderNo;
				if (pageNo == "pop") {
					//弹框
					_that.setState({
						showMsgBox: true,
						phone: res.data.phone,
						orderNo: res.data.orderNo
					});
				} else if (pageNo == "payBarCode") {
					_that.props.history.push({
						pathname: "/xhfHomeCredit"
					});
				} else if (pageNo === "closed") {
					// 收银台过来
					//从首页来直接关闭sdk
					yhTools.closePage({ flag: "MyProtocolList" });
				}
			} else {
				Toast.info(res.message, 2);
			}
		});
	}
	//生活发短信后签署合同
	shxhfVSignKlnContract(code) {
		let objs = {
			url: InterfaceG.shxhfVSignKlnContract,
			params: {
				source: this.isFromPayTool ? "0" : "-1", // 收银台传0,其余任意
				verifyCode: code,
				orderNo: this.state.orderNo,
				deviceId: this.props.getAppPlatformsDatas.devicesInfo.deviceId
			},
			_alertShow: false
		};
		let _that = this;
		Toast.loading("加载中...", 100);
		yhTools.request(objs).then(res => {
			if (res.code === "0") {
				Toast.hide();
				const pageNo = res.data.pageNo;
				if (pageNo == "payBarCode") {
					//去支付码页面
					if (this.props.location.query) {
						//从首页来直接关闭sdk
						yhTools.closePage({ flag: "MyProtocolList" });
					} else {
						_that.props.history.push({
							pathname: "/xhfHomeCredit"
						});
					}
				} else if (pageNo === "closed") {
					// 收银台过来
					//从首页来直接关闭sdk
					yhTools.closePage({ flag: "MyProtocolList" });
				}
			} else {
				Toast.info(res.message, 2);
			}
		});
	}

	islianlianSign() {
		let objs = {
			url: InterfaceG.signXhContract,
			params: {
				source: this.isFromPayTool ? "0" : "-1" // 收银台传0,其余任意
			},
			_alertShow: false
		};
		let _that = this;
		Toast.loading("加载中...", 100);
		yhTools.request(objs).then(res => {
			if (res.code === "0") {
				Toast.hide();
				_that.sendCode.countdown();
				const pageNo = res.data.pageNo;
				_that.orderNo = res.data.orderNo;
				if (pageNo == "pop") {
					//弹框
					_that.setState({
						showMsgBox: true,
						phone: res.data.phone,
						orderNo: res.data.orderNo
					});
				} else if (pageNo == "password") {
					//去设置密码
					if (this.props.location.query) {
						if (this.isFromPayTool) {
							_that.props.history.push({
								pathname: "/settransactionpassword",
								query: { name: "myProtocolList" }
							});
						}
					} else if (window.sessionStorage.getItem("myProtocolList")) {
						_that.props.history.push({
							pathname: "/settransactionpassword",
							query: { name: "myProtocolList" }
						});
					} else {
						_that.props.history.push({
							pathname: "/setPayPwd",
							state: {
								gotoNext: "fkm"
							}
						});
					}
				} else if (pageNo == "payBarCode") {
					_that.props.history.push({
						pathname: "/payCode"
					});
				} else if (pageNo === "closed") {
					// 收银台过来
					//从首页来直接关闭sdk
					yhTools.closePage({ flag: "MyProtocolList" });
				}
			} else {
				Toast.info(res.message, 2);
			}
		});
	}

	//签订循环合同，及协议支付接口
	vSignXhContract(code) {
		let objs = {
			url: InterfaceG.vSignXhContract,
			params: {
				source: this.isFromPayTool ? "0" : "-1", // 收银台传0,其余任意
				verifyCode: code,
				orderNo: this.state.orderNo,
				deviceId: this.props.getAppPlatformsDatas.devicesInfo.deviceId
			},
			_alertShow: false
		};
		let _that = this;
		Toast.loading("加载中...", 100);
		yhTools.request(objs).then(res => {
			if (res.code === "0") {
				Toast.hide();
				const pageNo = res.data.pageNo;
				if (pageNo == "password") {
					//去设置密码
					if (this.props.location.query) {
						if (this.props.location.query.name == "index") {
							// 收银台分支
							_that.props.history.push({
								pathname: "/settransactionpassword",
								query: { name: "myProtocolList" }
							});
						}
					} else if (window.sessionStorage.getItem("myProtocolList")) {
						// 收银台分支
						_that.props.history.push({
							pathname: "/settransactionpassword",
							query: { name: "myProtocolList" }
						});
					} else {
						_that.props.history.push({
							pathname: "/setPayPwd",
							state: {
								gotoNext: "fkm"
							}
						});
					}
				} else if (pageNo == "payBarCode") {
					//去支付码页面
					if (this.props.location.query) {
						//从首页来直接关闭sdk
						yhTools.closePage({ flag: "MyProtocolList" });
					} else {
						_that.props.history.push({
							pathname: "/payCode"
						});
					}
				} else if (pageNo === "closed") {
					// 收银台过来
					//从首页来直接关闭sdk
					yhTools.closePage({ flag: "MyProtocolList" });
				}
			} else {
				Toast.info(res.message, 2);
			}
		});
	}

	closeSendModal() {
		this.setState({
			showMsgBox: false
		});
	}

	sendYzm() {
		this.islianlianSign(true);
	}

	render() {
		let noDataObj = {
			type: "replaceList",
			msg: "暂无数据"
		};
		let _pageParams = {
			header: {
				title: "协议签署",
				goBackPath: "/xhfHomeNoCredit",
				goToApp: this.state.flag
			},
			history: this.props.history,
			cacheLifecycles: this.props.cacheLifecycles
		};
		const btnStyle = {
			height: "0.80rem",
			width: "6.96rem",
			borderRadius: ".40rem"
		};
		return (
			<MainLayout pageParams={_pageParams}>
				<div className="my-protocol-list-page">
					{/*<Header phoneStyle={this.props.getAppPlatformsDatas.phoneX}  goback pathName="goToback" title='我的协议' />*/}
					<div className="content-body" id="contentBody">
						<div className="list">
							{this.state.arrarAll.map((item, index) => {
								return (
									<div key={index}>
										<div
											className="item"
											onClick={this.gotoPage.bind(this, item, index)}
										>
											<label className="item-left">
												{this.state.arrarAll[index][2]}
											</label>
											<label className="item-center"></label>
											<i className="icon-arrorw-right" />
										</div>
										<div className="line"></div>
									</div>
								);
							})}
						</div>
						{this.state.arrarAll.length == 0 && this.state.isLoaded && (
							<NoData params={noDataObj} />
						)}
						{this.state.arrarAll.length != 0 && (
							<div className="protocol-list-btn">
								<XFButton
									btText={this.state.btnText}
									btnStyle={btnStyle}
									handleBtn={this.btnFn.bind(this)}
								/>
							</div>
						)}
					</div>
					<SendMSGCode
						sendSuccessPhone={this.state.phone}
						ref={ref => {
							this.sendCode = ref;
						}}
						getYZMCode={this.sendYzm.bind(this)}
						submitCode={this.submitCode.bind(this)}
						closeSendModal={this.closeSendModal.bind(this)}
						showMsgBox={this.state.showMsgBox}
					/>
				</div>
			</MainLayout>
		);
	}

	//进入合同页面
	gotoPage = item => {
		this.props._setSignedContract({
			intoType: "myProtocolList",
			objContact: item[4]
		});
		if (this.state.flag) {
			switch (item[1]) {
				case "xhht": //个人循环额度贷款合同
					// this.props.history.push({
					// 	pathname: "/personalCreditAmountContract",
					// 	query: { name: "myProtocolList" }
					// });
					this.props.history.push({
						pathname: "/iframeAgreements",
						state: {
							src: agreements_url + "/xhfCreditPaymentContract.html",
							title: "个人循环授信借款合同"
						}
					});
					break;
				case "zfxy": //永辉金融客户服务协议及授权书
					//打开支付协议页面
					this.props.history.push({
						pathname: "/agreementoflianyintong",
						query: { name: "myProtocolList" }
					});
			}
		} else {
			switch (item[1]) {
				case "xhht": //个人循环额度贷款合同
					// this.props.history.push({
					// 	pathname: "/personalCreditAmountContract"
					// });
					this.props.history.push({
						pathname: "/iframeAgreements",
						state: {
							src: agreements_url + "/xhfCreditPaymentContract.html",
							title: "个人循环授信借款合同"
						}
					});
					break;
				case "zfxy": //永辉金融客户服务协议及授权书
					//打开支付协议页面
					this.props.history.push({ pathname: "/agreementoflianyintong" });
			}
		}
	};
}

function mapStateToProps(state) {
	return state;
}

function mapDispatchToProps(dispatch) {
	return {
		_getDeviceInfoDatas: id => {
			//获取设备信息
			dispatch(getDeviceInfoDatas(id));
		},
		_setSignedContract: options => {
			dispatch(signedContract(options));
		},
		_setUserType: options => {
			dispatch(setUserType(options));
		},
		_getAppPlatformsDatas: options => {
			//获取设备信息
			dispatch(getAppPlatformsDatas(options));
		},
		_getPayDatas: options => {
			dispatch(getPayDatas(options));
		}
	};
}

const MyProtocolListPage = connect(
	mapStateToProps,
	mapDispatchToProps
)(MyProtocolList);
export default MyProtocolListPage;
